<template>
  <div>
    <el-descriptions
      class="margin-top"
      title="维保信息"
      :column="2"
      size="small"
      border
      v-if="id != null"
    >
      <el-descriptions-item label="维保商ID">
        <i class="el-icon-id-card" /> {{ form.maintenVendorId }}
      </el-descriptions-item>
      <el-descriptions-item label="维保商名称">
        <i class="el-icon-building" /> {{ form.maintenVendorName }}
      </el-descriptions-item>
      <el-descriptions-item label="维保商代码">
        <i class="el-icon-message" /> {{ form.maintenVendorCode }}
      </el-descriptions-item>
      <el-descriptions-item label="维保联系人ID">
        <i class="el-icon-user" /> {{ form.maintenPersonId }}
      </el-descriptions-item>
      <el-descriptions-item label="维保联系人">
        <i class="el-icon-user-solid" />
        {{ form.maintenPersonnelName }}
      </el-descriptions-item>
      <el-descriptions-item label="维保商联系电话">
        <i class="el-icon-phone" /> {{ form.maintenPersonnelPhone }}
      </el-descriptions-item>
      <el-descriptions-item label="维保期限(月)">
        <i class="el-icon-clock" /> {{ form.warranty }}个月
      </el-descriptions-item>
      <el-descriptions-item label="维保开始时间" v-if="form.maintenStarted != null">
        <el-date-picker v-model="form.maintenStarted" type="date":disabled="true"/>
      </el-descriptions-item>
      <el-descriptions-item label="维保状态">
        <el-tag v-if="form.maintenStatus === 1" type="success"
          >有效</el-tag
        >
        <el-tag v-else-if="form.maintenStatus === 2" type="warning"
          >已过期</el-tag
        >
        <el-tag v-else>未知状态</el-tag>
      </el-descriptions-item>
    </el-descriptions>
  </div>
</template>

<script>
import { fixedAsset } from "@/api/fixedAsset";
export default {
  props: ["id"],
  data() {
    return {
      form: {
        maintenVendorId: null, // 维保商ID
        maintenVendorName: "", // 维保商名称
        maintenVendorCode: "", // 维保商代码
        maintenPersonId: "", // 维保联系人ID
        maintenPersonnelName: "", // 维保商联系人
        maintenPersonnelPhone: "", // 维保商联系电话
        warranty: "", // 维保期限 (月)
        maintenStarted: new Date(), // 维保开始时间
        maintenStatus: "", // 维保状态（1：有效，2：已过期）
      },
    };
  },
  created() {
    this.getMaintenFixedAsset();
  },
  methods: {
    getMaintenFixedAsset() {
      fixedAsset.findMainten(this.id).then((res) => {
        this.form = res.data;
      });
    },
  },
};
</script>

<style scoped></style>
